<template>
  <view :class="$style.alert_collection">
    <view :class="$style.operation_group" v-show="true">
      <img :class="$style.img" :src="isFavoriteImg" alt="" srcset="">
      <view :class="$style.text">收藏</view>
    </view>
    <view :class="$style.operation_group" v-show="false">
      <img :class="$style.img" :src="favoriteImg" alt="" srcset="">
      <view :class="$style.text">未收藏</view>
    </view>
  </view>

</template>

<script setup lang='ts'>
import isFavoriteImg from "@/static/images/common/isFavorite.png";
import favoriteImg from "@/static/images/common/favorite.png";
import { ref } from "vue";

</script>

<style lang='less' module>
.alert_collection {
  width: calc(100% - 60rpx);
  height: 76rpx;
  box-sizing: border-box;
  background: #ffffff;
  box-shadow: 0rpx 4rpx 19rpx 1rpx rgba(51, 51, 51, 0.2);
  padding: 10rpx 10rpx 10rpx 20rpx;
  border-radius: 20rpx;
  font-family: Microsoft YaHei;
  display: flex;
  justify-content: center;
  align-items: center;
  align-self: center;

  .operation_group {
    display: flex;

    .img {
      width: 32rpx;
      height: 30rpx;
    }

    .text {
      font-size: 24rpx;
      font-family: Microsoft YaHei;
      font-weight: 400;
      color: #333333;
    }
  }

}
</style>
